import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)

//这里使用路由懒加载的方式申明组件,提高运行效率
const MainPage = () => import('../views/index/MainPage.vue')

const home = () =>
  import('../views/home/Home.vue')

const category = () =>
  import('../views/category/CateGory')

const shoppingCar = () =>
  import('../views/cart/ShoppingCar.vue')

const profile = () =>
  import('../views/profile/Profile')

const productDetails = () => import('../views/details/ProductDetails')

const routes = [{
    path: '/',
    redirect: '/MainPage',
  },
  {
    path: '/mainPage',
    redirect:'/mainPage/home',
    component: MainPage,
    children: [{
      path: 'home',
      component: home,
      meta: {
        name: '首页'
      }
    }, {
      path: 'category',
      component: category,
      meta: {
        name: '分类'
      }
    }, {
      path: 'shoppingCar',
      component: shoppingCar,
      meta: {
        name: '购物车'
      }
    }, {
      path: 'profile',
      component: profile,
      meta: {
        name: '我的'
      }
    }]
  },
  {
    path: '/productDetails',
    component: productDetails,
    meta: {
      name: '商品详情'
    }
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

// 路由导航
router.beforeEach((to, from, next) => {
  // if (Object.keys(to.matched[0]).length != 0) {
  //   //判断to的meta对象不为空
  //   document.title = to.matched[0].meta.name
  // }
  document.title = to.meta.name
  next()
})

export default router
